<template>
	<view class="asd">
		<cu-custom bgColor="bg-gradual-pink" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">详情</block>
		</cu-custom>
		<view class="cu-card article no-card" v-if="data">
			<view class="cu-item shadow">
				<view class="content" style="padding-top: 40px;">
					<image :src="data.image" mode="aspectFill"></image>
					<view class="desc">
						<view class="text-content"> {{data.info}}</view>
						<view>
							<view class="cu-tag bg-red light sm round">{{data.price}}</view>
						</view>
					</view>
				</view>
				<view style="float: right; margin-right: 20px;">
					<button class="cu-btn bg-grey lg" @click="handle">订单完成</button>
				</view>
			</view>
		</view>
		<view v-else>
			<image src="../../static/nodata.jpg" mode="" class="nodata"></image>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				data: {}
			}
		},
		methods: {
			getData(name) {
				let that = this
				const model = {
					nickName: name
				}
				this.$https.post(`/rest/heros`, model).then(res => {
					if (res.data.length) {
						that.data = res.data[0]
						that.data.image = res.data[0].image[0]
					} else {
						that.data = false
					}
				})
			},
			handle() {
				let that = this
				uni.showModal({
					title: '完成',
					content: `确定该订单已经完成吗`,
					cancelText: '取消',
					confirmText: '确定',
					success: res => {
						if (res.confirm) {
							const result = that.data
							result.status = 2
							that.$https.put(`/heros/${result._id}`, result).then(res => {
								that.getData()
							})
						}
					}
				})
			}
		},
		onLoad(option) {
			const name = option.name
			this.getData(name)
		},
	}
</script>

<style>
	.nodata {
		width: 100%;
		height: 200px;
		object-fit: cover;
	}

	.asd {
		height: 100vh;
		background-color: #FFFFFF;
	}
</style>
